<template>
  <div class="container">
    <div class="row border" v-for="(topic,index) in topics" :key="topic.id">
      <span class="col-2">{{index+1}}</span>
      <span class="col-8">{{topic.title}}</span>
      <span class="col-2">
        <router-link :to="{ name: 'topic' , params: { id : topic.id } }">详情</router-link>
      </span>
    </div>
  </div>
</template>

<script>
import x from "@/assets/topics";

export default {
  name: "List",
  data(){
    return { topics : x.topicList }
  },
  beforeRouteLeave(to,from){
    console.log( 'List: ' , `从${from.path}到${to.path}` );
  }
}
</script>

<style scoped>

</style>